<div ng-show="footerShow" class="navbar navbar-default navbar-fixed-bottom" role="navigation">
    
    <div class="container" ng-if="winnerValue === 3">
        <div class="alert alert-success small" style="margin:5px; min-height: 40px">
            <strong>Draw !</strong>
            <span class="badge pull-right">{{timer | time }}</span>
            <span class="badge pull-right">{{movesCount}}</span>
        </div>
    </div>
    
    <div class="container" ng-if="winnerValue !== 3" ng-switch="type">
        
        <div ng-switch-when="single-end">
            
            <div ng-if="winnerValue === playerValue" class="alert alert-success small" style="margin:5px; min-height: 40px">
                <strong>And the winner is {{OorX}}</strong>
                <span class="badge pull-right">{{timer | time }}</span>
                <span class="badge pull-right">{{movesCount}}</span>
            </div>
            <div ng-if="winnerValue !== playerValue" class="alert alert-danger small" style="margin:5px; min-height: 40px">
                <strong>And the winner is {{OorX}}</strong>
                <span class="badge pull-right">{{timer | time }}</span>
                <span class="badge pull-right">{{movesCount}}</span>
            </div>
            
        </div>
        
        <div ng-switch-when="single-start">
            
            <div ng-if="nextMoveValue === playerValue" class="alert alert-info small" style="margin:5px; min-height: 40px">
                It`s your move.
                <span class="badge pull-right">{{timer | time }}</span>
                <span class="badge pull-right">{{movesCount}}</span>
            </div>
            <div ng-if="nextMoveValue !== playerValue" class="alert alert-info small" style="margin:5px; min-height: 40px">
                <strong>Please wait...</strong>
                <span class="badge pull-right">{{timer | time }}</span>
                <span class="badge pull-right">{{movesCount}}</span>
            </div>
            
        </div>
        
        <div ng-switch-when="multi-end">
            
            <div class="alert alert-success small" style="margin:5px; min-height: 40px">
                <strong>And the winner is {{OorX}}</strong>
                <span class="badge pull-right">{{timer | time }}</span>
                <span class="badge pull-right">{{movesCount}}</span>
            </div>
                        
        </div>
        
        <div ng-switch-when="multi-start">
            
            <div class="alert alert-info small" style="margin:5px; min-height: 40px">
                Waiting for {{nextOorX}} move...
                <span class="badge pull-right">{{timer | time }}</span>
                <span class="badge pull-right">{{movesCount}}</span>
            </div>
            
        </div>
            
    </div>
</div>